// var str = 'hello world! \n 你好';
// console.log(str);
// //转义字符:某些字符在编程中被赋予了特定的含义；
// // \n:换行符
// var str2 = 'hello world! \\n 你好';
// console.log(str2);

var form = document.querySelector('form');
// 
form.onsubmit = function(event){
    console.log('------');
    // 阻止默认行为
    event.preventDefault();

    //判断密码与确认密码是否一致
    // 不一致，不提交，提示用户
    // 一致则提交

    var password = document.querySelector('input[name=password]').value;
    var confirm = document.querySelector('input[name=confirm]').value;
    if(password != confirm){
        alert('两次输入密码必须一致！！');
        return ;
    }

    //发请求,提交数据
    var name = document.querySelector('input[name=name]').value;
    var phone = document.querySelector('input[name=phone]').value;
    var age = document.querySelector('input[name=age]').value;
   
    var req = new XMLHttpRequest();
    req.onreadystatechange = function(){
        if(req.readyState == 4){
            console.log(req);
            // 状态码
            console.log(req.status);
            // 状态信息
            console.log(req.statusText);
            var data = JSON.parse(req.responseText);
            console.log(data);
            if(data.result == 1){
                location.href = './index.html';
            }else{
                alert(data.message);
            }
        }
    }
    var queryStr = '?name='+name+'&password='+password;
    // 如果用户填写了phone，则发送到服务器；否则，不发；
    if(phone){
        queryStr += '&phone='+phone;
    }
    if(age){
        queryStr += '&age='+age;
    }
    req.open('GET','api/register.php'+queryStr);
    req.send();
}

//JSON：javascript object notation js对象表示法
// JSON用于浏览器端与服务端交互;

// JSON最外层是一个{}
// {}中存放的都是key-value;
// "key",value取值string\number\boolean\array\JSON
var obj = {
    "name":"lucy",
    "age":25,
    "keywords":[
        "hello",
        "world"
    ]
}
//把json对象转化为字符串
var str = JSON.stringify(obj);
console.log(str);

// 把json字符串转化为json对象
var obj2 = JSON.parse(str);
console.log(obj2);


// req.status 
// status:状态
// http  状态码
// 从100--600都有
// 2开头，成功
// 4开头，浏览器端错误
// 5开头，服务端错误
// 状态码  状态信息        解释
// 200     OK             成功
// 304     not modified   未修改
// 404     not found      url错误
// 403     forbidden        禁止
// 500/503  server error  服务端错误 

//请求报文的具体构成：4部分
//请求行：请求方式  URL  协议/协议版本
//请求头：主机 内容类型  编码方式  用户代理 ....
//空行
//请求数据区(请求体):get请求数据在url后面，没有请求数据区；
         // post请求的数据放在请求数据区

// 响应报文的具体构成：4部分
// 响应行 ： 协议/协议版本  状态码 状态信息 
// 响应头:  响应时间 内容长度 内容类型 服务器类型 服务器语言...
// 空行
// 响应数据区(响应体)

// http://www.cnblogs.com/li0803/archive/2008/11/03/1324746.html
